<template>
  <div>
    我是父组件<br />
    <!-- <my-dialog /> -->
    <!-- 旧的写法 -->
    <!-- <my-dialog>
      <div slot="title">新增用户</div>

      <el-form
        :model="form"
        ref="form"
        label-width="80px"
        :inline="false"
        size="normal"
      >
        <el-form-item label="用户名">
          <el-input v-model="form.username"></el-input>
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button>取 消</el-button>
        <el-button type="primary">确 定</el-button>
      </span>
    </my-dialog> -->
    <!-- 新的写法 -->
    <my-dialog>
      <template v-slot:title>
        <div>新增用户111</div>
      </template>

      <el-form
        :model="form"
        ref="form"
        label-width="80px"
        :inline="false"
        size="normal"
      >
        <el-form-item label="用户名">
          <el-input v-model="form.username"></el-input>
        </el-form-item>
      </el-form>

      <template #footer>
        <el-button>取 消2</el-button>
        <el-button type="primary">确 定2</el-button>
      </template>
    </my-dialog>
  </div>
</template>

<script>
import MyDialog from './MyDialog'
export default {
  components: {
    MyDialog
  },
  data () {
    return {
      form: {
        username: ''
      }
    }
  }
}
</script>
